<?php
$HBS = [
    "HT-200"=>['min'=>170,'max'=>241, 'a'=>0],
    "HT-300"=>['min'=>187,'max'=>255, 'a'=>1],
    "HT-350"=>['min'=>197,'max'=>169, 'a'=>2],
    "QT500-7-正火"=>['min'=>170,'max'=>230, 'a'=>3],
    "QT600-3-正火"=>['min'=>190,'max'=>270, 'a'=>4],
    "ZG310-570-正火"=>['min'=>163,'max'=>197, 'a'=>5],
    "ZG340-640-正火"=>['min'=>169,'max'=>207, 'a'=>6],
    "45-正火"=>['min'=>162,'max'=>217, 'a'=>7],
    "45-调质"=>['min'=>197,'max'=>269, 'a'=>8],
    "ZG35SiMn-正火-h"=>['min'=>163,'max'=>217, 'a'=>9],
    "ZG35SiMn-调质"=>['min'=>197,'max'=>248, 'a'=>10],
    "ZG35CrMnSi-正火-h"=>['min'=>162,'max'=>217, 'a'=>11],
    "ZG35CrMnSi-调质"=>['min'=>162,'max'=>217, 'a'=>11.5],
    "35CrMo-调质"=>['min'=>241,'max'=>286, 'a'=>12],
    "40MnB-调质"=>['min'=>241,'max'=>286, 'a'=>13],
    "37SiMn2MoV-调质"=>['min'=>241,'max'=>302, 'a'=>14],
    "40Cr-调质"=>['min'=>241,'max'=>302, 'a'=>8],
    "ZG35SiMn-正火或调质-表面淬火"=>['min'=>450,'max'=>530, 'a'=>15],
    "45-正火或调质-表面淬火"=>['min'=>400,'max'=>500, 'a'=>16],
    "35CrMo-调质-表面淬火"=>['min'=>450,'max'=>550, 'a'=>17],
    "40MnB-调质-表面淬火"=>['min'=>450,'max'=>550, 'a'=>18],
    "37SiMn2MoV-调质-表面淬火"=>['min'=>500,'max'=>550, 'a'=>19],
    "40Cr-调质-表面淬火"=>['min'=>480,'max'=>550, 'a'=>20],
    "20Cr-渗碳-淬火-回火"=>['min'=>560,'max'=>620, 'a'=>21],
    "20CrMnTi-渗碳-淬火-回火"=>['min'=>560,'max'=>620, 'a'=>22],
    "38CrMoAiA-调质-短期气体或液体氮化硬度<450"=>['min'=>300,'max'=>450, 'a'=>23],
    "38CrMoAiA-调质-短期气体或液体氮化硬度>450"=>['min'=>450,'max'=>850, 'a'=>24],
    "38CrMoAiA-调质-长期气体氮化硬度>450"=>['min'=>480,'max'=>550, 'a'=>25],
    "氮化钢(无铝钢)，HBS>500"=>['min'=>480,'max'=>550, 'a'=>26]
];
?>
<!DOCTYPE html>
<html>
    <head>
    <meta http-equiv="Content-Type"	content="text/html; charset=utf-8"/>
    <meta charset="UTF-8">

    <script src="./layer/jquery.min.js"></script>
    <script src="./layer/layer.js"></script>
    <title>直齿圆柱齿轮传动设计</title>
<style>

.flex-container {
    margin:0 auto;
    width: 800px;
    height: 598px;
    background-color:#F0F0F0;
}
 
.flex-item {
    background-color: cornflowerblue;
    width: 100px;
    height: 100px;
    margin: 10px;
}
a{
    font-size: 3px;
}
p{ line-height:8px}
input{
    height: 12px;
}
.a1{
    width: 159px;
    height: 22px;
    margin-left: 10px;
}
</style>
</head>
<body>
<!--最外层div-->
<form action="2.php" method="POST" id="form">
<div class="flex-container">
<!--上下两个div-->
<!--第一个div 上-->
<div style="width: 800px;height: 100px;text-decoration: none;">
    <!--第一个div-->
    <div style="width: 240px;height:47px; padding: 10px;float: left;border:1px solid #fdfcfc; margin-left: 12px;
    margin-top: 27px;">
        <div style="float: left;margin-left: 2px;margin-top: 5px;">
            <a>功率(KW)</a>
            <br/>
            <input type="text" value="" name="kw" style="width: 100px;" placeholder="5~50"/>
        </div>
        <div style="float: left;margin-left: 20px;margin-top: 5px;">
            <a>主动轮转速(转/分) :</a>
            <br/>
            <input type="text" value="" name="n1" style="width: 100px;" placeholder="300~2000"/>
        </div>
    </div>
    <!--第二个div-->
    <div style="width: 169px;height: 68px;float: left;text-align:center;
    border: 0.5px solid RGB(170,170,170);margin-top: 23px;margin-left: 8px;">
        <label ><a>传动比</a></label>
        <br/>
        <input type="text" value="" name="u" style="width: 62px;" placeholder="3~6"/>
    </div>
    <!--第三个div-->
    <div style="width: 111px;height: 68px;float: left;border: 0.5px solid RGB(170,170,170); 
    text-align:center;margin-top: 23px;margin-left: 20px;">
        <div style="margin-top: 10px;"><input type="checkbox"  value="1" name="kaishi"/>
            <a>开式传动</a></div>
        <div><input type="checkbox"  value="2" name="dbl"/>
            <a>双向旋转</a></div>
    </div>
    <!--第四个div-->
    <div style="width: 179px;height: 89px;float: left;border: 0.5px solid RGB(170,170,170);margin-left: 10px;
    margin-top: 12px;">
     <div style="    margin-top: -12px;margin-left: 10px;background-color: #F0F0F0;width: 73px;">
        <a>选择工作时间</a>
    </div>
    <div style="width: 178px; margin-top: 4px;margin-left: 15px;">
        <a>工作年数: </a>
        <input type=”number” value="" name="year" style="width: 49px;margin-left: 33px;" placeholder="5~30"/>
    </div>
    
    <div style="width: 178px;margin-left: 15px;"><a>每年工作天数:</a>
        <input type=”number” value="" name="day" style="width: 49px;margin-left: 8px;" placeholder="250~365"/>
    </div>
    <div style="width: 178px;margin-left: 15px;"><a>每天工作时数:</a>
        <input type=”number” value=""  name="hour" style="width: 49px;margin-left: 8px;" placeholder="8~24"/>
    </div>
    </div>
</div>
<!--第两个div 下-->
<div style="width: 800px;height: 498px;float: left;">
    <!--分为左右两部分-->
    <!--左边-->
    <div style="width: 512px;height: 498px;float: left;">
        <!--上下和按钮-->
        <!--上部-->
        <div style="width: 512px;height: 235px;float: left;">
             <!--选择齿轮材料、热处理方法、硬度-->
            <div style="width: 335px;height: 222px;float: left; border: 0.5px solid RGB(170,170,170);
            margin-left: 12px;margin-top: 12px;">
                <div style="width: 180px;margin-left: 14px;margin-top: -13px;background-color: #F0F0F0;">
                <a>选择齿轮材料、热处理方法、硬度</a></div>       
                <div style="margin-left: 15px;margin-top: 10px;height: 79px;  border: 0.5px solid RGB(170,170,170);">

                    <div style="margin-top: -13px;margin-left: 7px;background-color: #F0F0F0;width: 36px;">
                        <a>主动轮</a>
                    </div>
                    <div style="margin-left: 8px;">
                        <select style="width: 303px;" id="select1" name="zdl_cl" >
                        <option></option>
                            <?php
                            foreach($HBS  as $k=>$v){?>
                                <option  value="<?=$k?>"><?=$k?></option>
                            <?php } ?>
                            </select>
                        <div id="div1" >
                            <a>硬度选择范围：<span id='span1'>000</span>-<span id='span2'>000</span> HBS</a>
                            <input type=”number” name="zdl_hbs" id="zhu1" style="width: 265px;">
                        </div>
                    </div>
                </div>

                <div style="margin-left: 15px;margin-top: 13px;height: 79px;  border: 0.5px solid RGB(170,170,170);">

                    <div style="margin-top: -13px;margin-left: 7px;background-color: #F0F0F0;width: 36px;">
                        <a>从动轮</a>
                    </div>
                    <div style="margin-left: 8px;">
                        <select style="width: 303px;" id="select2" name="cdl_cl" >
                        <option></option>
                        <?php
                            foreach($HBS  as $k=>$v){?>
                                <option value="<?=$k?>"><?=$k?></option>
                            <?php } ?>
                            </select>
                        <div id="div2" >
                            <a>硬度选择范围：<span id='span3'>000</span>-<span id='span4'>000</span> HBS</a>
                            <input type=”number” name="cdl_hbs"  id="fu1" style="width: 265px;">
                        </div>
                    </div>
                </div>

            </div>

            <!--齿轮布置形式-->
            <div  style="width: 152px;height: 222px;margin-top: 12px;margin-left: 9px;float: left;border: 0.5px solid RGB(170,170,170)">
                <div class="a1" style="margin-top: 16px;"> 

                    <div style="margin-top: -29px;background-color: #F0F0F0;width: 72px; " >
                        <a>齿轮布置形式</a>
                    </div>
                    <div style="float: left;width: 143px;">
                    <div style="float: left;" >
                        <input type="radio" name="gear" value="1" >
                    </div>
                    <div style="float: left;">
                        <a>对称布置</a>
                    </div>
                     </div>
                </div>
                
                <br/>
                <div class="a1" style="margin-top: -3px;">
                    <div style="float: left;">
                        <input type="radio" name="gear" value="3" >
                    </div>
                    <div style="float: left;">
                        <a>悬臂布置</a>
                    </div>  
                </div>
                <br/>
                <div class="a1" style=" margin-top: -12px;"> 
                    <div style="float: left;">
                        <input type="radio" name="gear" value="2"  >
                    </div>
                    <div style="float: left; width: 93px;margin-top: -11px;" >
                        <a style="line-height: 0.5">非对称布置（轴刚性大）</a>
                    </div>
                </div>
                <br/>
                <div class="a1" style="margin-top: -1px;"> 
                    <div style="float: left;" >
                        <input type="radio" name="gear" value="2" >
                    </div>
                    <div style="float: left; width: 96px;margin-top: -11px">
                        <a  style="margin:0; padding:0" >非对称布置（轴刚性小）</a>
                    </div>
                </div>
                
                <br/>
                <div style="width: 159px;height: 42px;margin-top: -10px;"> 
                    <div style="float: left;margin-left: 10px;margin-top: 10px;" >
                        <input type="radio" name="gear" value="2">
                    </div>
                    <div style="float: left;width: 96px;">
                        <a style="margin:0; padding:0">中间轴上布置两个齿轮，同侧啮合</a>
                    </div>
                </div>
                
                <br/>
                <div style="width: 159px;height: 42px;margin-top: -21px;"> 
                    <div style="float: left;margin-left: 10px;margin-top: 10px;" >
                        <input type="radio" name="gear" value="2" >
                    </div>
                    <div style="float: left;width: 96px;">
                        <a  style="margin:0; padding:0">中间轴上布置两个齿轮，异步侧啮合</a>
                    </div>
                </div>
            
            </div>
        </div>
        <!--选择齿轮类型及毛胚类-->


        <!--下部-->
        <div style="width: 512px;height: 213px;border: 0.5px solid RGB(170,170,170);float: left;">
            
            <!--选择齿轮类型及毛胚类型-->
            <div style="width:266px;height: 194px;border: 0.5px solid RGB(170,170,170);float: left;margin-left: 12px;
            margin-top: 13px;">
                <div style="margin-top: -13px;margin-left: 8px;background-color: #F0F0F0;width: 132px; ">
                    <a>选择齿轮类型及毛胚种类</a></div>
             <!--主动轮-->
             <div style="width: 238px;height: 91px; border: 0.5px solid RGB(170,170,170);float: left;
                 margin-top: 22px; margin-left: 10px;"> 
                <div style="margin-top: -13px; margin-left: 8px;background-color: #F0F0F0;width: 38px;">
                    <a>主动轮</a>
                </div>
                <div style="margin-top: 3px; margin-left: 20px;">
                <input type="radio"  name="forging" value="dz" disabled="disabled" id="zhulunleixing1"  > <a class="zhulunleixing" style="color:#8e8484;">锻造</a>
                <input type="radio" name="forging"  value="zz" disabled="disabled" id="zhulunleixing2" > <a class="zhulunleixing" style="color:#8e8484;">铸造</a>
                <input type="radio"  value="0" name="nei"/> <a>内齿轮</a>
                 </div>
                <br/>

            </div>
            <!--从动轮-->
            <div style="width: 238px;height: 43px; border: 0.5px solid RGB(170,170,170);float: left;
            margin-left: 10px;margin-top: 17px;">
                <div style="margin-top: -13px; margin-left: 8px;background-color: #F0F0F0;width: 38px;"><a>从动轮</a></div>
                
                <div style=" margin-left: 20px;">
                <input type="radio" name="forging1" value="dz" disabled="disabled" id="fulunleixing1" > <a class="fulunleixing" style="color:#8e8484;">锻造</a>
                <input type="radio" name="forging1" value="zz" disabled="disabled"  id="fulunleixing2" > <a class="fulunleixing" style="color:#8e8484;">铸造</a>
                <input type="radio"  value="1" name="nei"/> <a>内齿轮</a>
                </div>  
            </div>
            </div>
            <div style="width:182px;height: 191px;border: 0.5px solid RGB(170,170,170);float: left;margin-left: 17px; margin-top: 14px;">
                <div style="margin-left: 10px;margin-top: -13px;background-color: #F0F0F0;width: 86px;">
                    <a>选择齿数、系数</a></div>

                <!--选择齿数、系数-->
                <div style="width: 152px;height: 28px; margin-top: 4px;margin-left: 15px;border-bottom:1px solid #000">
                    <a>主动齿轮数: </a>
                    <input type="number" value="" name="z1" id="z1" style="width: 49px;margin-left: 27px;"/>
                </div>
                <script>
                    var zmsg = true;
                    $('#z1').blur(function(){
                        var z1 = $(this).val();
                        if(z1<17){
                            zmsg = false;
                            alert('您所填的齿数小于最小根切齿数，请重新选择');
                        }else{
                            zmsg = true;
                        }
                    })
                </script>
                <div style="width: 152px;height: 28px; margin-top: 4px;margin-left: 15px;border-bottom:1px solid #000">
                    <a>接触安全系数: </a>
<!--                    jiechuanquanxishu-->
                    <input type="number" value="" name="s" style="width: 49px;margin-left: 16px;"/>
                </div>
                <div style="width: 152px;height: 28px; margin-top: 4px;margin-left: 15px;border-bottom:1px solid #000">
                    <a>弯曲安全系数: </a>
<!--                    wanquanquanxishu-->
                    <input type="number" value="" name="sa" style="width: 49px;margin-left: 16px;"/>
                </div>
                <div style="width: 152px;height: 28px; margin-top: 4px;margin-left: 15px;border-bottom:1px solid #000">
                    <a>初估载荷系数: </a>
<!--                    chuguzaihexishu-->
                    <input type="number" value="" name="kht" style="width: 49px;margin-left: 16px;"/>
                </div>
            </div>
        </div>
        <!--按键-->
        <div>
         <div style=" float: left;margin-left: 124px; margin-top: 14px;">
            <button type="button" style=" width: 74px;" onclick="tijiao()">确定</button>
        </div>
        <div style=" float: left;margin-left: 124px;margin-top: 14px;">
            <button type="button" style=" width: 74px;">结束</button>
        </div>
        </div>
    </div>
    <!--右边-->
    <div style="    width: 279px;margin-left: 6px;height: 478px;float: left;border: 0.5px solid RGB(170,170,170); margin-top: 12px;">
        <div style="margin-top: -13px;margin-left: 10px;background-color: #F0F0F0;width: 108px;"> 
        <a>工作机、原动机特性</a>
        </div>  
    <div style="width: 274px;height: 218px;border: 0.5px solid RGB(170,170,170);margin-left: 5px;margin-top: 20px; ">
        <div style="margin-top: -13px;margin-left: 10px;background-color: #F0F0F0;width: 38px;">
            <a>工作机</a>
        </div>


        <div style="height: 56px; ">
            <div style="float: left;margin-top: 10px;">
                <input type="radio" name="gzj" value="pw"/>
            </div>
         <div style="float: left;width: 20px;">
            <a>平稳</a>
        </div>
            <div style="float: left;width: 227px;border: 0.5px solid RGB(170,170,170)"><samp style="font-size: 1px;">发电机:均匀传送的带式运输机或板式运输机，螺旋运输机，轻型升降机，包装机
            </samp></div>
        </div>

        <div style="height: 56px;">
            <div style="float: left;margin-top: 10px;">
                <input type="radio" name="gzj" value="qh"/>
            </div>
         <div style="float: left;width: 20px;">
            <a>轻振</a>
        </div>
            <div style="float: left;width: 227px;border: 0.5px solid RGB(170,170,170)"><samp style="font-size: 1px;">不均匀传动（如包装件）的带运输机或板式运输机机床主传动，重型升降机
            </samp></div>
        </div>
        <div style="height: 56px;">
            <div style="float: left;margin-top: 10px;">
                <input type="radio" name="gzj" value="zz"/>
            </div>
         <div style="float: left;width: 20px;">
            <a>中振</a>
        </div>
            <div style="float: left;width: 227px;border: 0.5px solid RGB(170,170,170)"><samp style="font-size: 1px;">橡胶挤压机，橡胶和塑料搅拌机，球磨机（轻型），木工机械（锯片、木车床）
            </samp></div>
        </div>
        <div style="height: 56px; ">
            <div style="float: left;margin-top: 10px;">
                <input type="radio" name="gzj" value="qz"/>
            </div>
         <div style="float: left;width: 20px;">
            <a>强振</a>
        </div>
            <div style="float: left;width: 227px;border: 0.5px solid RGB(170,170,170)"><samp style="font-size: 1px;">挖掘机，球磨机（重型）橡胶搓揉几，破碎机，冶金机械，旋转式钻机
            </samp></div>
        </div>
    </div>
    <div style="width: 274px;height: 209px;border: 0.5px solid RGB(170,170,170);margin-left: 5px;margin-top: 20px; ">
        <div style="margin-top: -13px;margin-left: 10px;background-color: #F0F0F0;width: 38px;">
            <a>原动机</a>
        </div>
        <div style="height: 56px; ">
            <div style="float: left;margin-top: 10px;">
                <input type="radio" name="ydj" value="pw"/>
            </div>
         <div style="float: left;width: 24px;margin-top: 10px;">
            <a>平稳</a>
        </div>
            <div style="float: left;width: 211px;border: 0.5px solid RGB(170,170,170);    margin-left: 9px;
            margin-top: 10px;"><samp style="font-size: 1px;">电动机（例如直流电动机.均写运转的赛汽机、燃汽轮机（小的，起动力距小）

            </samp></div>
        </div>

        <div style="height: 56px;">
            <div style="float: left;margin-top: 10px;">
                <input type="radio"  name="ydj" value="qh"/>
            </div>
         <div style="float: left;width: 24px;margin-top: 10px;">
            <a>轻振</a>
        </div>
            <div style="float: left;width: 211px;border: 0.5px solid RGB(170,170,170);    margin-left: 9px;
            margin-top: 10px;"><samp style="font-size: 1px;">蒸汽轮机、燃汽轮机、液压马达、电动机较大、经常出现较大的起动力距)

            </samp></div>
        </div>
        <div style="height: 40px;">
            <div style="float: left;margin-top: 10px;">
                <input type="radio"  name="ydj" value="zz"/>
            </div>
         <div style="float: left;width: 24px;margin-top: 10px;">
            <a>中振</a>
        </div>
            <div style="float: left;width: 211px;border: 0.5px solid RGB(170,170,170);    margin-left: 9px;
            margin-top: 10px;"><samp style="font-size: 1px;">多缸内燃机
            </samp></div>
        </div>
        <div style="height: 56px; ">
            <div style="float: left;margin-top: 10px;">
                <input type="radio"  name="ydj" value="qz"/>
            </div>
         <div style="float: left;width: 24px;margin-top: 10px;">
            <a>强振</a>
        </div>
            <div style="float: left;width: 211px;border: 0.5px solid RGB(170,170,170);    margin-left: 9px;
            margin-top: 10px;"><samp style="font-size: 1px;">单缸内燃机
            </samp></div>
        </div>
    </div>
    </div>
</div>

</div>
</form>
</body>
</html>
<script>
    $('#select1').change(function(){
        var cl = $('#select1').val();
        $.ajax({
            type:'POST',
            url :"list_array(1).php",
            dataType:'json',
            data:'cl='+cl,
            success:function (data){
                if(cl!="HT-200"&&cl!="HT-300"&&cl!="HT-350"&&cl!="QT500-7-正火"&&cl!="QT600-3-正火"){
                    $("#zhulunleixing1").removeAttr("disabled");
                    $("#zhulunleixing2").removeAttr("disabled");
                    $(".zhulunleixing").removeAttr("style");
                }else{
                    $("#zhulunleixing1").attr("disabled",true);
                    $("#zhulunleixing2").attr("disabled",true);
                    $(".zhulunleixing").attr("style","color:#8e8484;" );
                }
                $("#span1").text(data['min']);
                $("#span2").text(data['max']);
                $('#zhu1').val(data['a'])
            }
        })
    });
    $('#select2').change(function() {
        var cl = $('#select2').val();
        $.ajax(
            {
                type: 'POST',
                url: "list_array(1).php",
                dataType: 'json',
                data: 'cl=' + cl,
                success: function (data) {
                    if (cl != "HT-200" && cl != "HT-300" && cl != "HT-350" && cl != "QT500-7-正火" && cl != "QT600-3-正火") {
                        $("#fulunleixing1").removeAttr("disabled");
                        $("#fulunleixing2").removeAttr("disabled");
                        $(".fulunleixing").removeAttr("style");
                    } else {
                        $("#fulunleixing1").attr("disabled", true);
                        $("#fulunleixing2").attr("disabled", true);
                        $(".fulunleixing").attr("style", "color:#8e8484;");
                    }
                    $("#span3").text(data['min']);
                    $("#span4").text(data['max']);
                    $('#fu1').val(data['a'])
                }

            })
    })
</script>
<script>
    var zhu = true;
    var fu = true;
    $('#zhu1').blur(function(){
        var min = $('#span1').text();
        var max = $('#span2').text();
        var hbs = $(this).val();
        if(hbs<min || hbs>max){
            alert('主动轮硬度值超出材料硬度值范围')
            zhu = false;
        }else{
            zhu = true;
        }
    });
    $('#fu1').blur(function(){
        var min = $('#span3').text();
        var max = $('#span4').text();
        var hbs = $(this).val();
        if(hbs<min || hbs>max){
            alert('从动轮硬度值超出材料硬度值范围')
            fu = false;
        }else{
            fu = true;
        }
    });
</script>
<script>
function tijiao(){

    $zhulunleixing1=$("#zhulunleixing1").attr("disabled");
if(typeof($zhulunleixing1)=="undefined"){
   var zhudonglun = $('input:radio[name="forging"]:checked').val();
     if(zhudonglun==null){
        layer.msg('请选择主动齿轮 毛坯种类')
        return false
     }    
}
$fulunleixing1=$("#fulunleixing1").attr("disabled");
if(typeof($fulunleixing1)=="undefined"){
   var fudonglun = $('input:radio[name="forging1"]:checked').val();
     if(fudonglun==null){
        layer.msg('请选择从动齿轮 毛坯种类')
        return false
     }    
}
//判断 主动轮材料 有无选择
    var select1=$('#select1').val();
    var select2=$('#select2').val();
if(select1==0 || select2==0){
    layer.msg('请选择，主从动轮材料 热处理方法 硬度', {
        icon: 2,
        offset: ['50px', '400px']
    });
	return false;
}

    var val=$('input:radio[name="gear"]:checked').val();
if(val==null){
    layer.msg('请选择齿轮布置形式', {
        icon: 2,
        offset: ['50px', '600px']
    });
	return false;
}
var val=$('input:radio[name="ydj"]:checked').val();
if(val==null){
    layer.msg('请选择原动机特性', {
        icon: 5,
        offset: ['380px', '900px']
    });
	return false;
}
var val=$('input:radio[name="gzj"]:checked').val();
if(val==null){
    layer.msg('请选择工作机特性', {
        icon: 5,
        offset: ['100px', '900px']
    });
	return false;
}
if(zhu && fu && zmsg){
    $('#form').submit();
}else{
    alert('请更改主动轮或从动轮硬度值')
}

}
</script>